// import Nevow.Athena

// import MochiKit.Base
// import MochiKit.DOM
// import MochiKit.Iter
// import MochiKit.Style
// import MochiKit.Signal
// import MochiKit.Color
// import MochiKit.Position
// import MochiKit.Visual
// import MochiKit.DragAndDrop

Stickies.Board = Nevow.Athena.Widget.subclass('Stickies.Board');

Stickies.Board.methods(
    function __init__(self, node){
        Stickies.Board.upcall(self, "__init__", node);
        self.nextId = 0;
        self.callRemote("load_board");
        /* var div = document.getElementById("board:1"); */
        var div = document.getElementsByClassName("board")[0];

        // Create a corresponding droppable
        self.board = new MochiKit.DragAndDrop.Droppable(div, {
                accept: ['notecard'],
                    ondrop: function (element) {
                    self.drop(element);
                }
        });
    },
    function drop(self, element){
        var d = self.callRemote(
            'update_position',
            element.id,
            element.style.left,
            element.style.top
        );
        return d;
    },
    function update_position(self, id, left, top){
        var div = document.getElementById("notecard:" + id);
        div.style.left = left;
        div.style.top = top;
        return id;
    },
    function echo(self, argument){
        alert("Echoing " + argument);
        return argument;
    },
    function add_notecard(self, id){
        /* if(id >= self.nextId){ */
            // we need to add this card to our view of the board.
            self.nextId = id + 1;

            var div = document.getElementById("athena:1");
            var new_div = document.createElement("div");
            var noteId = id;

            new_div.textContent = noteId;
            new_div.id = "notecard:" + noteId;
            new_div.className = "notecard";
            div.appendChild(new_div);
            new_div.style.left = new_div.offsetLeft + 'px';
            new_div.style.top = new_div.offsetTop + 'px';
            var draggable = new Draggable(new_div);
            return noteId;
        /*        }
        else{
            throw new Error("I already have this card.");
        } */
    },
    function create_notecard(self){
        var div = document.getElementById("athena:1");
        var new_div = document.createElement("div");
        var noteId = self.nextId++;

        new_div.textContent = noteId;
        new_div.id = "notecard:" + noteId;
        new_div.className = "notecard";
        div.appendChild(new_div);
        new_div.style.left = new_div.offsetLeft + 'px';
        new_div.style.top = new_div.offsetTop + 'px';
        var d = self.callRemote(
            'created_notecard', noteId, new_div.style.left, new_div.style.top
        );
        d.addCallback(
            function(){
                new Draggable(new_div);
            }
        );
        return noteId;
    },
    function position_notecard(self, id, left, top){
        alert("id"+id+" left "+left+" top "+top);
        var new_div = document.getElementById("notecard:" + id);
        new_div.style.left = left;
        new_div.style.top = top;
        /* return id; */
    },
    function clicked(self){
        self.create_notecard();
    }
);
